<template>
	<h2>自定义hook函数</h2>
	<h2>x:{{ x }},y:{{ y }}</h2>
	<h3 v-if="loading">正在加载中...</h3>
	<h3 v-else-if="errorMsg">错误信息:{{ errorMsg }}</h3>
</template>

<script lang="ts">
import { NOT_LOCAL_BINDING } from "@babel/types"
import { defineComponent } from "vue"
import userMousePosition from "./hooks/useMousePosition"
import useRequest from "./hooks/useRequest"

export default defineComponent({
	name: "App",
	// 需求1：用户在页面中点击页面，把点击的位置的横纵坐标手机起来并暴漏出去
	setup() {
		const { x, y } = userMousePosition()
		const { loading, data, errorMsg } = useRequest("data/address.json") // 获取对象数据
		// const { loading, data, errorMsg } = useRequest("地址1") // 获取数据数据
		return {
			x,
			y,
			loading,
			errorMsg,
			data
		}
	}
})
</script>

<style></style>
